import { Directive, ElementRef, HostListener, Input } from '@angular/core';

@Directive({
  selector: '[appHighLight]'
})
export class HighLightDirective{
  constructor(private el: ElementRef) { }

  private defaultColor = 'red';

  @Input('appHighLight') bgColor = '';

  @HostListener('mouseenter') onMouseEnter(){
    this.el.nativeElement.style.backgroundColor = this.bgColor || this.defaultColor;
  }
}
